<template>

	<view class="login-form">
    <view class="item">
      <image src="@/static/login.png"></image>
    </view>
    
		<view class="item">
			<view class="account">
				<text class="input-item">用户名</text>
				<input  data-type=""  placeholder-class="inp-palcehoder" placeholder="请输入用户名"
					v-model="userInfo.userName"></input>
			</view>
		</view>
		<view class="item">
			<view class="account">
				<text class="input-item">密码</text>
				<!-- <input type="password" data-type="password" placeholder-class="inp-palcehoder" placeholder="请输入密码" -->
				<input data-type="" placeholder="请输入密码"
					v-model="userInfo.password"></input>
			</view>
		</view>
		<view>
			<button class="authorized-btn" @click="login">登录</button>
			<button class="to-idx-btn" @click="resisters">没有账号？去注册></button>
		</view>
		<!--  <view class="operate">
             <view class="to-register" bindtap="handleChangeShowType">
                 {{isRegister?'已有账号？去登录>' : '没有账号？去注册>'}}
             </view>
         </view> -->
	</view>



</template>

<script>
	import {
		post
	} from '../../../request'
	import loginVue from './login.vue'
	export default {
		data() {
			return {
				active: true,
				userInfo: {
					userName: '',
					password: ''
				}
			}
		},
		methods: {
			//登录
			login() {
				console.log('请求登录页面接口 user/login', {
					"userPhone": this.userInfo.userName,
					"password": this.userInfo.password,
					"userType": 2,
				})
				this.$request.post('user/login', {
					"userPhone": this.userInfo.userName,
					"password": this.userInfo.password,
					"userType": 2,
					// "code": 100000000,
				}).then(res => {
					console.log('获取登录页面接口 user/login', res)
					//说明用户登录成功
					uni.setStorageSync('userLogin', true)

					this.$store.commit('getToken', res.data)
					this.$store.commit('changeName', this.userInfo.userName, this.userInfo.password)
					uni.setStorageSync('token', res.data)
					uni.setStorageSync('userInfo', this.userInfo.userName)
					uni.setStorageSync('password', this.userInfo.password)

					uni.switchTab({
						url: '/pages/index/index'
					})

				})

			},
			//注册
			resisters() {
				uni.navigateTo({
					url: "/pages/resister/resister/resister"
				})
			}
		},
		onLoad() {

			// this.userInfo.userName =  this.$store.state.name
		},
		onShow() {

			let userLogin = uni.getStorageSync('userLogin');
			let userInfo = uni.getStorageSync('userInfo');
			let password = uni.getStorageSync('password')
			console.log("没有数据", userLogin)
			if (userLogin) {
				//说明是登录成功过 true
				this.userInfo.userName = JSON.parse(JSON.stringify(userInfo))
				this.userInfo.password = JSON.parse(JSON.stringify(password))
				this.login()
			}
		},
	}
</script>

<style scoped lang="scss">
	view.msg {
		font-size: 24rpx;
		color: #666;
		width: 100%;
		text-align: center;
		margin-top: 10rpx;
	}

	view.title {
		font-size: 28rpx;
		color: #333;
		width: 100%;
		text-align: center;
		margin: 20rpx 0;
	}

	button {
		margin-top: 30rpx;
		width: 450rpx;
		height: 70rpx;
		line-height: 70rpx;
		font-size: 30rpx;
		color: #fff;
		background: #eb2444;
		border: 2rpx solid #eb2444;
	}




	page {
		background: #fff;
		height: 100%;
	}



	.login-form {
		width: 90%;
		margin: 0 auto;
		margin-top: 50%;
		transform: translateY(-50%);
	}

	.authorized-btn {
		width: 100%;
		margin: 0 auto;
		text-align: center;
		background-color: #0ab906;
		border: 1rpx solid #0ab906;
		color: #fff;
		border-radius: 6rpx;
		font-size: 26rpx;
		margin-top: 60rpx;
	}

	.to-idx-btn {
		width: 100%;
		margin: 0 auto;
		text-align: center;
		background-color: #eeeeee;
		border: 1rpx solid #eeeeee;
		color: #333;
		border-radius: 6rpx;
		font-size: 26rpx;
		margin-top: 30rpx;
	}

	.form-title {
		width: 100%;
		margin-bottom: 50rpx;
		font-size: 32rpx;
		text-align: center;
		color: #00a0e9;
	}

	.item {
		display: block;
    width: 100%;
		margin-bottom: 30rpx;
    text-align: center;
    image{
       width:  300rpx;
       height: 300rpx;
       // height: 50%;
       // height: 130rpx;
       object-fit: cover;
      
    }
	}

	.account {
		display: flex;
		background: #f8f8f8;
		padding: 15rpx;
		box-sizing: border-box;
		font-size: 26rpx;
		align-items: center;
	}

	.account input {
		padding-left: 20rpx;
		width: 75%;
	}

	.inp-palcehoder {
		font-size: 26rpx;
	}

	.account input.int-yzm {
		width: 410rpx;
		padding-right: 10rpx;
		box-sizing: border-box;
	}

	.input-btn {
		width: 152rpx;
		font-size: 26rpx;
		color: #00a0ea;
		text-align: center;
	}

	button::after {
		border: 0 !important;
	}

	.input-item {
		width: 90rpx
	}
</style>